<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>科学知识库 - Odyssey Of Wildlife</title>
    <link rel="stylesheet" href="./css/homepage.css">
</head>
<body>
    <div class="top-background">
        <div class="hero-overlay"></div>
        <header>
            <div class="logo">
                <img src="./css/src/md-pets@1x.png" alt="Logo">
                <span>odyssey of wildlife</span>
            </div>
            <nav>
                <ul>
                    <li><a href="../index.html">开始</a></li>
                    <li><a href="../2Dsection/hello.html">科普展示</a></li>
                    <li><a href="#">互动游戏</a></li>
                    <li><a href="#" class="active">科学知识库</a></li>
                    <li><a href="#">关于我们</a></li>
                </ul>
            </nav>
            <div class="user-actions">
                <a href="#" class="profile-btn">
                    <img src="./css/src/user-icon.png" alt="User">
                    <span>个人主页</span>
                </a>
                <a href="#" class="login-btn">Login / Register</a>
            </div>
        </header>
        
        <section class="hero-section">
            <div class="hero-content">
                <h1>科学知识库</h1>
                <p>经纬生命史诗，典藏寰宇年轮</p>
            </div>
        </section>
    </div>
    
    <section class="content-section">
        <div class="content-image">
            <img src="./css/src/图片 2@1x.png" alt="大象">
        </div>
        <div class="content-text">
            <h2><a href="migration_vs.html" class="content-link">迁徙数据可视化</a></h2>
            <p>使用动态图表可视化动物迁徙相关统计数据，包括迁徙范围、迁徙物种、迁徙距离等。</p>
        </div>
    </section>
    
    <section class="content-section">
        <div class="content-image">
            <img src="./css/src/图片 3@1x.png" alt="鸟">
        </div>
        <div class="content-text">
            <h2><a href="paper_check.html" class="content-link">相关文献查询</a></h2>
            <p>动物迁徙相关文献、期刊、研究资料库，可根据物种等关键词进行检索。</p>
        </div>
    </section>
    
    <section class="content-section">
        <div class="content-image">
            <img src="./css/src/图片 4@1x.png" alt="羚羊">
        </div>
        <div class="content-text">
            <h2><a href="data_upload.html" class="content-link">科学数据上传</a></h2>
            <p>支持专业用户更新迁徙数据、上传文献，上传轨迹并可可视化到地图上。</p>
        </div>
    </section>
</body>
</html>